// 该文件专门用于创建整个应用的路由器
import About from "../pages/About";
import Home from "../pages/Home";
import News from "../pages/News";
import Message from "../pages/Message";
import Detail from "../pages/Detail";
import { createRouter, createWebHashHistory } from "vue-router";
import { name } from "pubsub-js";

const routes = [
    //一级路由
    {
        name:'guanyu',
        path: '/about',
        component: About
    },
    {
        path: '/home',
        component: Home,
        children:[
            {
                path: 'news',
                component: News
            },
            {
                path: 'message',
                component: Message,
                children:[
                    {
                        name:'xiangqing',
                        path: 'detail/:id/:title',
                        component: Detail,
                        //props的第一种写法，值为对象，该对象中的所有key-value都会以props的形式传给Detail组件
                        // props:{
                        //     a: 'aa',
                        //     b: 'bb'
                        // }

                        //第二种写法，值为布尔，若布尔值为真，就会把该路由组件收到的所有params参数，以props的形式传给dDetail组件
                        // props:true

                        //第三种写法，值为函数
                        // props($route){
                        //     return {
                        //         id: $route.query.id,
                        //         title: $route.query.title
                        //     }
                        // }
                        //使用连续解构赋值进行简化
                        props({query:{id, title}}){
                            return {
                                id,title
                            }
                        }


                    }
                ]
            },
        ]
    }
]

const router = createRouter({
    history: createWebHashHistory(process.env.BASE_URL),
    routes
})
export default router;